<template>
  <div class="container">
    <el-row>
      <el-col :span="16" :offset="4">
          <el-row class="navbar">
            <el-col :offset="4">
              <el-breadcrumb separator-class="el-icon-arrow-right">
                <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
                <el-breadcrumb-item :to="{ path: '/about' }">关于我们</el-breadcrumb-item>
                <el-breadcrumb-item>{{navLocation}}</el-breadcrumb-item>
              </el-breadcrumb>
            </el-col>
            <el-col :offset="4" :span="20">
              <p></p>
            </el-col>
          </el-row>
          <el-row :gutter="20">
            <el-col :span="4">
                <el-menu
                  default-active="1"
                  class="el-menu-vertical-demo"
                  @select="handleSelect">
                  <el-menu-item index="1">
                    <i class="el-icon-share"></i>
                    <span slot="title">公司简介</span>
                  </el-menu-item>
                  <el-menu-item index="2" >
                    <i class="el-icon-document"></i>
                    <span slot="title">公司文化</span>
                  </el-menu-item>
                </el-menu>
            </el-col>
            <el-col :span="20">
              <el-row>
                <el-col v-if="navLocation=='公司简介'">
                  <img src="https://tse1-mm.cn.bing.net/th/id/R-C.379f4b9ede502fc38ebe47f0695c7502?rik=7M43WQsSMBD%2fig&riu=http%3a%2f%2fwww.jiayuntaihe.com%2fhome%2f5%2f4%2feczsbv%2fresource%2f2018%2f07%2f20%2f5b51827b4b4d2.jpg&ehk=sFIoFA8S39T2bLSY2YKHsWD5Bw%2bsWqiWXtFGyFD2jqU%3d&risl=&pid=ImgRaw" alt="">
                  <span style="text-indent: 40px; margin:20px 0px;">
                    我们是一家为海绵城市建设提供专业化系统解决方案的高新技术企业，提供海绵城市建设的咨询、区域规划和项目设计、各类应用场景的系统解决方案及施工，项目的运营及维护等专业服务，拥有相关产品的研发、生产及销售能力，产品已获批多项专利。公司主编、参编、入编多项国家、地方、行业标准及规范，获得主管部门和客户的一致认可。

      主要产品有雨水收集利用系统、屋顶绿化系统、市政道路排水系统、面源污染控制系统和智慧海绵监控系统。应用领域涉及建筑小区、市政工程、园林景观、环境整治等工程。成功完成项目千余个，样板工程有北京国际园艺博览会国际馆、冬奥会五棵松场馆、上海临港开发区等。已与包括深圳水务、中广核环保、万科地产、华润集团、碧桂园集团、中建集团、中兴通讯等在内的诸多品牌达成战略合作。
      亚井人将一如既往地紧跟国家海绵城市建设的发展战略，深耕市场需求、持续加大研发投入，严格践行“聚焦水环境领域，为人类美好生活贡献力量！”的企业使命，愿与您共同推动海绵城市建设的持续健康发展！
                  </span>
                </el-col>
                <el-col v-if="navLocation=='公司文化'">
                  <img src="http://www.shkjem.com/static/news_top.jpg" alt="">
                  <span style="text-indent: 40px; margin:20px 0px;">
                  我们是一家为海绵城市建设提供专业化系统解决方案的高新技术企业，提供海绵城市建设的咨询、区域规划和项目设计、各类应用场景的系统解决方案及施工，项目的运营及维护等专业服务，拥有相关产品的研发、生产及销售能力，产品已获批多项专利。公司主编、参编、入编多项国家、地方、行业标准及规范，获得主管部门和客户的一致认可。

    主要产品有雨水收集利用系统、屋顶绿化系统、市政道路排水系统、面源污染控制系统和智慧海绵监控系统。应用领域涉及建筑小区、市政工程、园林景观、环境整治等工程。成功完成项目千余个，样板工程有北
    我们是一家为海绵城市建设提供专业化系统解决方案的高新技术企业，提供海绵城市建设的咨询、区域规划和项目设计、各类应用场景的系统解决方案及施工，项目的运营及维护等专业服务，拥有相关产品的研发、生产及销售能力，产品已获批多项专利。公司主编、参编、入编多项国家、地方、行业标准及规范，获得主管部门和客户的一致认可。

    主要产品有雨水收集利用系统、屋顶绿化系统、市政道路排水系统、面源污染控制系统和智慧海绵监控系统。应用领域涉及建筑小区、市政工程、园林景观、环境整治等工程。成功完成项目千余个，样板工程有北京国际园艺博览会国际馆、冬奥会五棵松场馆、上海临港开发区等。已与包括深圳水务、中广核环保、万科地产、华润集团、碧桂园集团、中建集团、中兴通讯等在内的诸多品牌达成战略合作。
    亚井人将一如既往地紧跟国家海绵城市建设的发展战略，深耕市场需求、持续加大研发投入，严格践行“聚焦水环境领域，为人类美好生活贡献力量！”的企业使命，愿与您共同推动海绵城市建设的持续健康发展！
    我们是一家为海绵城市建设提供专业化系统解决方案的高新技术企业，提供海绵城市建设的咨询、区域规划和项目设计、各类应用场景的系统解决方案及施工，项目的运营及维护等专业服务，拥有相关产品的研发、生产及销售能力，产品已获批多项专利。公司主编、参编、入编多项国家、地方、行业标准及规范，获得主管部门和客户的一致认可。

    主要产品有雨水收集利用系统、屋顶绿化系统、市政道路排水系统、面源污染控制系统和智慧海绵监控系统。应用领域涉及建筑小区、市政工程、园林景观、环境整治等工程。成功完成项目千余个，样板工程有北京国际园艺博览会国际馆、冬奥会五棵松场馆、上海临港开发区等。已与包括深圳水务、中广核环保、万科地产、华润集团、碧桂园集团、中建集团、中兴通讯等在内的诸多品牌达成战略合作。
    亚井人将一如既往地紧跟国家海绵城市建设的发展战略，深耕市场需求、持续加大研发投入，严格践行“聚焦水环境领域，为人类美好生活贡献力量！”的企业使命，愿与您共同推动海绵城市建设的持续健康发展！
    我们是一家为海绵城市建设提供专业化系统解决方案的高新技术企业，提供海绵城市建设的咨询、区域规划和项目设计、各类应用场景的系统解决方案及施工，项目的运营及维护等专业服务，拥有相关产品的研发、生产及销售能力，产品已获批多项专利。公司主编、参编、入编多项国家、地方、行业标准及规范，获得主管部门和客户的一致认可。

    主要产品有雨水收集利用系统、屋顶绿化系统、市政道路排水系统、面源污染控制系统和智慧海绵监控系统。应用领域涉及建筑小区、市政工程、园林景观、环境整治等工程。成功完成项目千余个，样板工程有北京国际园艺博览会国际馆、冬奥会五棵松场馆、上海临港开发区等。已与包括深圳水务、中广核环保、万科地产、华润集团、碧桂园集团、中建集团、中兴通讯等在内的诸多品牌达成战略合作。
    亚井人将一如既往地紧跟国家海绵城市建设的发展战略，深耕市场需求、持续加大研发投入，严格践行“聚焦水环境领域，为人类美好生活贡献力量！”的企业使命，愿与您共同推动海绵城市建设的持续健康发展！京国际园艺博览会国际馆、冬奥会五棵松场馆、上海临港开发区等。已与包括深圳水务、中广核环保、万科地产、华润集团、碧桂园集团、中建集团、中兴通讯等在内的诸多品牌达成战略合作。
    亚井人将一如既往地紧跟国家海绵城市建设的发展战略，深耕市场需求、持续加大研发投入，严格践行“聚焦水环境领域，为人类美好生活贡献力量！”的企业使命，愿与您共同推动海绵城市建设的持续健康发展！
                </span>
                </el-col>
              </el-row>
            </el-col>
          </el-row>
      </el-col>
    </el-row>
  </div>
</template>

<script>

export default {
  name:'about',
  data(){
    return{
      navLocation:'公司简介'
    }
  },
  methods:{
    handleSelect(index){
      this.navLocation=index==1?'公司简介':'公司文化'
    }
  }
}
</script>

<style lang="scss" scoped>
.container{
  .navbar{
    margin: 20px 0px;
    p{
      height: 10px;
      border-bottom: 2px solid #ccc;
    }
  }
}
</style>
